import React from 'react';
import {BrowserRouter as Router,Route,Link} from 'react-router-dom'
import ReactRouter from './pageRouter'
import PageRedux from './pageRedux/list'
import Commit from './Commit';
import Redirects from './pageRouter/Redirects'
import {Example as useContext} from './pageRedux/useContext'
import useReducer from './pageRedux/useReducer'
import useMemo from './pageRedux/useMemo'
import useRef from './pageRedux/useRef'
import useCallback from './pageRedux/useCallback'

function AppRouter(){
    return(
        <div>
            <Router>
                <ul>
                    <li><Link to='/Commit'>首页</Link></li>
                    <li><Link to='/ReactRouter'>React-router-dom</Link></li>
                    <li><Link to='/PageRedux'>Redux</Link></li>
                    <li><Link to='/Redirects'>重定向</Link></li>
                    <li><Link to='/useContext'>useContext</Link></li>
                    <li><Link to='/useReducer'>useReducer</Link></li>
                    <li><Link to='/useMemo'>useMemo</Link></li>
                    <li><Link to='/useRef'>useRef</Link></li>
                    <li><Link to='/useCallback'>获取窗口大小</Link></li>
                </ul>
                <Route path="/Commit" component={Commit}></Route>
                <Route path="/ReactRouter" component={ReactRouter}></Route>
                <Route path="/PageRedux" component={PageRedux}></Route>
                <Route path="/Redirects" component={Redirects}></Route>
                <Route path="/useContext" component={useContext}></Route>
                <Route path="/useReducer" component={useReducer}></Route>
                <Route path="/useMemo" component={useMemo}></Route>
                <Route path="/useRef" component={useRef}></Route>
                <Route path="/useCallback" component={useCallback}></Route>
            </Router>
        </div>
    )
}

export default AppRouter;